<template>
<rx-dialog @handOk="ok" @cancel="cancel" class="rx-custom-control-dialog">
    <a-form layout="vertical" class="rx-a-form-vertical">

        <a-form-item :label="custI18('popupTitle','弹窗标题')">
            <a-input v-model="config.title" />
        </a-form-item>

        <a-form-item>
            <span slot="label">
                {{custI18('componPath','组件路径')}}
                <a-tooltip>
                <template slot="title">
                    {{custI18('pathTip',"组件路径是src/views 目录下的组件，例如 流程定义的文件路径为src/views/modules/bpm/core/BpmDefList.vue，那么在组件配置时配置为:modules/bpm/core/BpmDefList.vue")}}

                </template>
                <a-icon type="question-circle-o"/>
                </a-tooltip>
            </span>
            <a-input v-model="config.path" />
        </a-form-item>

        <a-form-item :label="i18n2('form.openMode','打开方式')">
            <open-mode :local-config="config"></open-mode>
        </a-form-item>
        <a-form-item >
            <span slot="label">
                {{custI18('callbackmethod','回调方法')}}
                <a-tooltip>
                    <template slot="title">
                        {{custI18('callTip1','可以有两个参数 action,data是自定义组件返回的数据!')}} <br>
                    </template>
                    <a-icon type="question-circle-o"/>
                </a-tooltip>
            </span>
            <a-input v-model="config.callback" :placeholder="custI18('callback','参数为 action,data')"></a-input>
        </a-form-item>
        <a-form-item >
            <span slot="label">
                {{custI18('preMethod','前置方法')}}
                <a-tooltip>
                    <template slot="title">
                        {{custI18('preMethodSuccess','方法返回')}} {success:true,msg:""}
                    </template>
                    <a-icon type="question-circle-o"/>
                </a-tooltip>
            </span>
            <a-input v-model="config.preMethod"></a-input>
        </a-form-item>
        <a-form-item >
            <span slot="label">
                {{custI18('returnParameters','获取参数方法')}}
                <a-tooltip>
                    <template slot="title">
                         {{custI18('ParametersSuccess','参数返回')}}{ name:""}
                    </template>
                    <a-icon type="question-circle-o"/>
                </a-tooltip>
            </span>
            <a-input v-model="config.returnParameters"></a-input>
        </a-form-item>
    </a-form>
</rx-dialog>
</template>

<script>
import { RxDialog ,RxMonacoEditor ,Util} from "@lowcode/jpaas-common-lib"
import OpenMode from "@/views/modules/form/core/listCommon/OpenMode";

export default {
    name: "CustomControlDialog.vue",
    components:{
        OpenMode,
        RxDialog,
        RxMonacoEditor
    },
    props:{
        layerid:{
            type:String
        },
        lydata:{
            type:Object
        },
        destroy:Function,
        openConfig:{
            type:Object,
            default:()=>{
              return  {

              }
            }
        }
    },
    data(){
        return {
            config:{
                title:'',
                path:'',
                width:'',
                height:'',
                callback:'',
                shade:false,
                model:true,
                isMax:'YES',
                preMethod:'',
                returnParameters:'',
            }
        }
    },
    created() {
        this.config = this.openConfig ;
    },
    methods:{
        i18n(name,text,key){
            return this.$ti18(name,text,"formSolution",key);
        },
        custI18(name,text,key){
            return this.$ti18(name,text,"formSolution.customControl",key);
        },
        i18n2(name, text, key) {
            return this.$ti18(name, text, "formBoListDialog", key);
        },
        ok(vm){
            vm.loading = false ;
            Util.closeWindow(this,'ok',this.config);
        },
        cancel(){
            Util.closeWindow(this);
        },

    }
}
</script>

<style scoped>
.rx-custom-control-dialog >>> .ant-form-vertical .ant-form-item{
    margin-bottom: 0;
}
</style>